<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="apple-touch-fullscreen" content="YES">
		<meta name="format-detection" content="telephone=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta http-equiv="Expires" content="-1">
		<meta http-equiv="pragram" content="no-cache">
		<title>Calendar</title>
		<link rel="stylesheet" href="cal2.css">
		<script type="text/javascript">
			var phoneWidth =  parseInt(window.screen.width);
			var phoneScale = phoneWidth/640;
			var ua = navigator.userAgent;
			if (/Android (\d+\.\d+)/.test(ua)){
				var version = parseFloat(RegExp.$1);
				// andriod 2.3
				if(version>2.3){
					document.write('<meta name="viewport" content="width=640, minimum-scale = '+phoneScale+', maximum-scale = '+phoneScale+', target-densitydpi=device-dpi">');
				// andriod 2.3以上
				}else{
					document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">');
				}
				// 其他系统
			} else {
				document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
			}
			// 微信去掉下方刷新栏
			if(RegExp("MicroMessenger").test(navigator.userAgent)){
				document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
						WeixinJSBridge.call('hideToolbar');
				});
			}
		</script>
	</head>
	<body>
		<div class="dateBox">If you see me, please click me.</div>

		<div class="page" style="display: none">
			<div class="calendar-ctrl">
				<ul>
					<li class="cancel-btn">取消<b></b></li>
					<li class="date-info"></li>
					<li class="confirm-btn">确定<b></b></li>
				</ul>
				<div class="calendar-err"></div>
			</div>
			<div class="calendar"></div>
		</div>
		<script src="cal2.js"></script>
		<script>
		(function() {
			var newDay = new Date();
			var year = newDay.getFullYear(),
				month = newDay.getMonth(),
				date = newDay.getDate();
			var startDate = new MyDate(year, month+1, date);
			var endDate = startDate.buildNextDate();

			var confirmAnimation = function() {
				var page = document.querySelector('.page');
				var dateBox = document.querySelector('.dateBox');
				_.removeClass(page, 'upAnimation');
				_.addClass(page, 'downAnimation');

				var startDateText = this.startDate.toString();
				var endDateText = this.endDate.toString();
				dateBox.innerHTML = '<p>' + startDateText + '(入住)</p><p>' + endDateText + '(离店)</p>';

				setTimeout(function() {
					_.hide(page);
				}, 600);
			};

			var data = {'default': 256, '2015-01-31': 378, '2015-02-24': 745, '2015-02-20': -234.2, '2015-02-23': 3.45};
			var data1 = [123, 234, 345, 456, 567, 678, 789, 890, 901, 012, 123, 234, 345, 456, 567, 678, 789, 890, 901, 123, 234, 345, 456, 567, 678, 789, 890, 901, 123, 234, 345, 456, 567, 678, 789, 890, 901,  456, 567, 678, 789, 890, 901, 012, 123, 234, 345, 456, 567, 678, 789, 890, 901, 123, 234, 345, 456, 567, 678];
			var mCal = new App();

			mCal.on('confirm', function() {
				console.log(this.get('startDate'));
				console.log(this.countTotalPrice());
				confirmAnimation.call(this);
			});
			mCal.on('confirm', function() {
				console.log(this.get('endDate').toString());
			});
			mCal.on('cancel', function() {
				console.log(this.get('endDate').toString());
				confirmAnimation.call(this);
		    });
		    mCal.on('dateBoxTouch', function() {
		    	//console.log('none');
		    });
			mCal.set('startDate', startDate)
				.set('endDate', endDate)
				.set('maxDate', 160);
			mCal.set('count', 6).init();

			for (date in data) if (data[date] < 0) data[date] = 0;
			mCal.renderPrice(data);
			//mCal.renderPrice1(data1);
		})();
		</script>
	</body>
</html>